<template>
    <div id="app">
        <div class="tabbar">
            <router-link v-for="l in items" :to="l.path" @click>
                <i :class="l.icon"></i>
                <div class="a" @click="ha">
                    {{l.name}}
                </div>
            </router-link>
        </div>
        <!--<router-view></router-view>-->
    </div>
</template>

<script>
    export default {
        data() {
            return {
              
                items: [{ name: "全部", path: "/home" }, { name: "精华", path: "/good" }, { name: "分享", path: "/share" }, { name: "提问", path: "/ask" }, { name: "招聘", path: "/find" }]
            }
        },
        methods:{
            ha(){
                var he = document.getElementsByClassName
            }
        }
         
        }

</script>

<style scoped>
    .tabbar {
        height: 44px;
        line-height: 44px;
        position: fixed;
        top: 44px;
        background: white;
        border-bottom: 1px solid #ccc;
        text-align: center;
        width: 100%;
        display: flex;
        font-size: 13px;
       
    }
    
    .tabbar a {
        flex-basis: 20%;
        color: #999;
        /*line-height: 23px*/
    }
    
    .is-active {
        color: black!important
    }
</style>